<template>
  <div class="tab-cont">
    <custom-title name="历史任务列表" />
    <el-table :data="list" @selection-change="handleSelectionChange">
      <el-table-column type="selection" align="center" width="45" />
      <el-table-column label="ID" align="center" prop="id" min-width="250px" sortable show-overflow-tooltip />
      <el-table-column label="KEY" align="center" prop="taskDefinitionKey" min-width="130px" sortable show-overflow-tooltip />
      <el-table-column label="流程名称" align="center" prop="name" min-width="100px" show-overflow-tooltip />
      <el-table-column label="实例ID" align="center" prop="processInstanceId" min-width="260px" show-overflow-tooltip />
      <el-table-column label="创建时间" align="center" prop="createTime" min-width="160px" show-overflow-tooltip />
      <el-table-column label="开始时间" align="center" prop="startTime" min-width="160px" show-overflow-tooltip />
      <el-table-column label="办理人" align="center" prop="assignee" min-width="80px" show-overflow-tooltip />
    </el-table>
    <pagination v-if="list.length" :current-page="form.pageNum" :total="total" :page-size="form.pageSize" @changeData="getInstancesByUserName" />
  </div>
  </template>
  
  <script>
  import { getInstancesByUserName } from '@/api/process'
  export default {
    data() {
      return {
        form: {
          pageNum: 1,
          pageSize: 10
        },
        total: 0,
        list: []
      }
    },
    mounted() {
      this.$nextTick(() => {
        this.getInstancesByUserName()
      })
    },
    methods: {
      // 列表复选框操作
      handleSelectionChange(item) {
        console.log(item)
      },
      renderTime(date) {
          const dateee = new Date(date).toJSON();
          return new Date(+new Date(dateee) + 8 * 3600 * 1000).toISOString().replace(/T/g, ' ').replace(/\.[\d]{3}Z/, '')
      },
      async getInstancesByUserName(item) {
        this.form.pageNum = item && item.pageNum ? item.pageNum : 1
        this.form.pageSize = item && item.pageSize ? item.pageSize : 10
        const { status, obj } = await getInstancesByUserName(this.form)
        if (status === 0) {
          obj.list.forEach((x) => {
            x.time = this.renderTime(x.time)
            x.startTime = this.renderTime(x.startTime)
            x.createTime = this.renderTime(x.createTime)
          })
          this.list = obj.list
          this.total = obj.totalNum
        }
      }
    }
  }
  </script>
  
  <style lang="scss" scoped></style>